// components/tree-item/tree-item.ts
Component({
  options: {
    addGlobalClass: true,
  },

  properties: {
    item: {
      type: Object,
      value: {},
    },
  },

  data: {
    // 控制当前节点是否展开，默认为 item._expanded 的值，若无则为 false
    isExpanded: false,
  },

  observers: {
    // 监听从页面传递过来的 _expanded 属性，用于初始化展开状态
    "item._expanded": function (expanded) {
      if (typeof expanded === "boolean" && this.data.isExpanded !== expanded) {
        this.setData({ isExpanded: expanded });
      }
    },
  },

  methods: {
    /**
     * 切换当前节点的展开/折叠状态
     * 只有当存在子节点时才响应
     */
    toggleExpand() {
      if (!this.data.item.children || this.data.item.children.length === 0) {
        return;
      }
      this.setData({
        isExpanded: !this.data.isExpanded,
      });
    },

    /**
     * 点击编辑按钮时触发
     * @param e 事件对象
     */
    onEdit(e: WechatMiniprogram.TouchEvent) {
      // 阻止事件冒泡到 item-content 的 tap 事件
      // WXML中已使用 catch:tap，此处代码逻辑上无需再阻止

      // 触发 'edit' 自定义事件，并将当前节点数据传递给父组件/页面
      this.triggerEvent("edit", { item: this.data.item });
    },

    /**
     * 接收来自子组件的 'edit' 事件，并继续向上传递
     * 这是实现递归组件事件穿透的关键
     * @param e 自定义事件对象，e.detail 包含了原始的事件数据
     */
    propagateEdit(e: WechatMiniprogram.CustomEvent) {
      this.triggerEvent("edit", e.detail);
    },
  },
});
